var bus=new Vue();

/*下拉菜单*/
Vue.component('drop-menu',{
    props:{
        menulist:{
            type:Array,
            default:function(){
                return [];
            }
        },
        deftitle:{
            type:String,
            default:function(){
                return '';
            }
        },
        sendname:{
            type:String,
            default:function(){
                return '';
            }
        }
    },
    data:function(){
        return {
            title:this.deftitle,
            bOk:false,
            list:this.menulist,
            name:this.sendname
        }
    },
    methods:{
        open:function(){
            this.bOk=!this.bOk;
        },
        show:function(item){
            var _this=this;
            this.title=item[0];
            this.bOk=false;
            bus.$emit(_this.name,item[1]);
        }
    },
    template:`
    <div class=" pressure-input border fr">
            <p class="pressure-input-text pressure-input-drop" @click="open">
				{{title}}
            </p>
            <ul class="pressure-input-list" v-show="bOk">
                <li class="pressure-input-item" v-for="item in list"  @click="show(item)">
                {{item[0]}}</li>
            </ul>
    </div>`
});
//消息中心
Vue.component('my-message',
    {
        props:['msg'],
        data:function(){
            return {
                width:'',
                message:this.msg,
                canceldata:false,
                currIndex:0,
                resonList:[],
                reasonVal:'',
                subId:'',

            }
        },
        template:`
        <div>
            <ul class="content-list" id="content_list">
                <li class="content-item conent-list-li clearfix" v-for="(item,index) in message">
                    <p class="content-name fl w200 mr2 line-height62">
                        <el-tooltip placement="top">
                              <el-button>【{{item.device_name}}】{{item.title}}</el-button>
                        </el-tooltip>
                    </p>
                    <p class="content-descrbie fl w100 mr2 line-height62">{{item.start_time |formatterTime}}</p>
                    <p class="content-descrbie fl w100 mr2 line-height62">{{item.end_time |formatterTime}}</p>
                    <p class="content-descrbie fl w100 mr2 line-height62">{{item.cancel|toStatus}}</p>
                    <p class="content-ascription fl w120 mr2 line-height62">{{item.prediction|formatterVal|keepTwo}}x10<sup>4</sup>m<sup>3</sup>/h</p>
                    <div class="fl content-status">
                        <div class="content-prediction-scroll">{{item.description}}</div>
                    </div>
                 
                </li>
            </ul>
        </div>   
        `,
        filters:{
            formatterTime:function(val){
                var val=Math.abs(val);
                var date=new Date(val);
                var month=date.getMonth()+1;
                var day=date.getDate();
                var hour=date.getHours();
                var min=date.getMinutes();
                return toDou(month)+"-"+toDou(day)+" "+toDou(hour)+":"+toDou(min);
            },
            toStatus:function(val){
                switch (val){
                    case 0:
                        return 'X';
                        break;
                    case 1:
                        return '√';
                        break;
                    default:
                        return 'X';
                }
            },
            keepTwo:function(val){
                return val.toFixed(2);
            },
            formatterVal:function(val){
               // var val=Math.abs(val);
                return val/Math.pow(10,4)
            }
        },
        methods:{

        }
    });



var app = new Vue({
    el:"#app",
    data:{
        headerMenuList:[
            ['全  部','all'],
            ['锅  炉','guolu'],
            ['热风炉','gaolu/refenglu'],
            ['轧  钢','zhagang'],
            ['高  炉','gaolu'],
            ['其  他','other']
        ],
        msglist:[],
        furnaceName:'',
        valStart:'',
        valEnd:'',
        timeStamp:0,
        timeStart:0
    },
    filters:{
        keepTwo:function(val){
            return val.toFixed(2);
        },
        formatterVal:function(val){
            return val/Math.pow(10,5);
        },
        keepInteger:function(val){
            return Math.floor(val);
        },
        toCn:function(val){
            switch(val){
                case 'erjia':
                    return '二加';
                    break;
                case 'yijia':
                    return '一加';
                    break;
                case 'junre':
                    return '均热';
                    break;
            }
        },
        formatterTime:function(val){
            var oDate=new Date(val);
            var year=oDate.getFullYear();
            var month=oDate.getMonth()+1;
            var date=oDate.getDate();
            var hour=oDate.getHours();
            var minute=oDate.getMinutes();
            return year+'年'+toDou(month)+'月'+toDou(date)+'日  '+toDou(hour)+':'+toDou(minute);
        }

    },
    mounted:function(){
        this.$nextTick(function(){
            var _this = this
            this.selectfurnaceName()
            this.waveChart()
            this.getTimeStamp()
        });
    },
    methods:{
        timeStartFn: function(){
            this.timeStart = new Date(new Date(this.timeStamp).setHours(0, 0, 0, 0))/1
        },
        //获取信息中心的数据
        getMessage:function(){
            //本地测试../data/gaolu-msg.json
        },
        getfurnaceName:function(){
            //this.furnaceName = getStore('furnace');
            var _this=this;
            var success=function(res){
                _this.msglist=res.data;
            };
            var error=function(e){
                console.log('加载全部消息出错了');
            };
            this.$http(URL+'/message/history?start='+_this.timeStart+'&end='+_this.timeStamp).then(success,error)
            console.log('开始'+_this.timeStart+'结尾'+_this.timeStamp)
        },
        sure:function(){
            this.msglist=[];
            var _this=this;
            var success=function(res){
                _this.msglist=res.data;
            };
            var error=function(e){
                console.log('加载'+this.furnaceName+'消息出错了');
            };
            if(this.furnaceName=='all'){
                this.$http(URL+'/message/history?start='+this.valStart+'&end='+this.valEnd).then(success,error)
            }else{
                this.$http(URL+'/message/'+this.furnaceName+'/history?start='+this.valStart+'&end='+this.valEnd).then(success,error);
            }

        },
        datePicker:function(Val){
            var _this=this;
            laydate({
                istime: true,
                format:'YYYY-MM-DD hh:mm',
                choose:function(dates){ //选择好日期的回调
                    //_this.valStart = dates;
                    var oldTime = (new Date(dates)).getTime();
                    if(Val=='valStart'){
                        _this.valStart = oldTime
                    }else if(Val=='valEnd'){
                        _this.valEnd = oldTime
                    }
                }
            })
        },
        selectfurnaceName:function(){
            var _this=this;
            bus.$on('num',function(num){
                //console.log(1)
                _this.furnaceName=num;
            })

        },
        getTimeStamp:function(){
            var _this=this;
            var success=function(res){
                _this.timeStamp=res.data.time;
                _this.timeStartFn()
                _this.getfurnaceName()
                //console.log(res.data);
                //_this.sectionTime=getSectionTime(_this.timeStamp,7);
                //_this.sectionTimeBoiler=getSectionTime(_this.timeStamp,1);
            };
            var error=function(e){
                console.log('加载时间戳出错了');
            };
            this.$http.get(URL+'/time/getTime').then(success,error);
        },
        waveChart:function(){
            /*波动归因*/
            Chart3('gas_chart',URL+'/coalgas/quanwang/bodongguiyin');
        }
    }
});





